<template>
	<view>
		<view>
			<view class="container">
				<view class="s-cells">
					<textarea class="s-textarea" v-model="content" placeholder="请输入您的申诉内容..." maxlength="50" @input="content_input" placeholder-class="s-phcolor-color"/>
					<view class="s-textarea-counter">{{content_length}}/50</view>
				</view>
				<view class="s-box-upload">
					<view class="s-upload-box">
						<view class="s-image-item" v-for="(item,index) in images" :key="index">
							<image :src="item.url" class="s-item-img" mode="aspectFill"></image>
							<view class="s-img-del" @tap="image_del(index)"></view>
							<view class="s-upload-mask">
								<view class="s-mask-btn" hover-class="s-hover"
								 :hover-stay-time="150" @tap.stop="image_preview(index)">查看图片</view>
							</view>
						</view>
						<view class="s-upload-add" v-if="images.length<9" @tap="upload_file">
							<view class="s-upload-icon s-icon-plus"></view>
						</view>
					</view>
				</view>
				<view class="s-cmt-btn">
					<s-button type="danger" @click="order_complain">确定</s-button>
				</view>
			</view>
		</view>
	</view>
</template>
<script> 
	export default {
		data() {
			return {
				order_id:'',
				content:'',
				content_length:0,
				images:[]
			}
		},
		onLoad(options) {
			this.order_id = options.id
		},
		methods: {
			//商品申诉
			async order_complain() {
				if(this.content==''){
					return await this.$s.uniApi.showToast({title: '请输入您的申诉内容！'});
				}
				await this.$s.model.order.orderComplain({
					order_id:this.order_id,
					content:this.content,
					images:this.images
				})
				await this.$s.uniApi.navigateBack({})
			},
			//监听input
			content_input(index){
				this.content_length = this.$s.api.getLength(this.content)
			},
			//图片上传
			async upload_file(){
				var length = 9-this.images.length
				const res = await this.$s.http.upload(length)
				this.images.push(res)
			},
			//删除图片
			image_del(index){
				this.images = order_complain.delete_arr_index(this.images,index)
			},
			//查看图片
			image_preview(index){
				var arr = []; 
				for(var i = 0;i<this.images.length;i++){
					arr.push(this.images[i].url)
				}
				uni.previewImage({
					current: this.images[index].url,
					urls: arr
				})
			}
		}
	}
</script>
<style lang="scss" scoped>
@import 'order_complain.scss';
</style>
